<template>
  <div id="bshare">
    <ul>
      <li>
        <img @click="dealShare($event,'weixin')" src="static/weixin.png" width="50" height="50">
      </li>
      <li>
        <img @click="dealShare($event,'pyquan')" src="static/pyquan.png" width="50" height="50">
      </li>
      <li>
        <img @click="dealShare($event,'qqim')" src="static/qq.png" width="50" height="50">
      </li>
      <li>
        <img @click="dealShare($event,'qzone')" src="static/kongjian.png" width="50" height="50">
      </li>
      <li>
        <img @click="dealShare($event,'sinaminiblog')" src="static/weibo.png" width="50" height="50">
      </li>
    </ul>
    <hr>
    <span @click="dealCancel">取消</span>
  </div>
</template>

<script>
export default {
  name: 'Bshare',
  methods: {
    dealShare (event, type) {
      // console.log("type = "+type)

      // 设置分享内容
      bShare.addEntry({
        title: this.dict.title,
        url: location.href,
        summary: this.dict.forward,
        pic: this.netif.imagePrefix + this.dict.img_url
      })

      if (type !== 'more') {
        // 开始分享
        bShare.share(event, type, 0)
        return false
      } else {
        bShare.more(event)
        return false
      }
    },
    dealCancel () {
      this.$emit('close')
    }
  }
}
</script>

<style scoped>
  #bshare {
    width: 60%;
    height: 15rem;
    position: absolute;
    bottom: 0rem;
    background-color: rgba(238,238,238,0.71);
  }
  #bshare ul {
    position: relative;
  }
  #bshare ul li {
    float: left;
    margin: 1rem calc(10% - 25px);
    list-style: none;
  }
  hr{
    margin: 9.5rem 0 0;
  }
  span {
    width: 100%;
    height: 5rem;
    display: inline-block;
    text-align: center;
    line-height: 5rem;
    position: relative;
    font-size: 2rem;
    color: red;
  }
</style>
